import React, { FC, useRef, useState } from 'react'

// const UseRefDemo: FC = () => {
//   const inputRef = useRef<HTMLInputElement>(null)

//   function selectInput() {
//     const inputElem = inputRef.current
//     if (inputElem) {
//       inputElem.select()
//     }
//   }

//   return (
//     <div>
//       <input ref={inputRef} placeholder="placeholder" defaultValue="hello world" type="text" />
//       <button onClick={selectInput}>选中 input</button>
//     </div>
//   )
// }

const UseRefDemo: FC = () => {
  const [nameRef, setNameRef] = useState(useRef('李子一'))
  function changeName() {
    setNameRef({ current: 'liziyi' })
    console.log(nameRef)
  }
  return (
    <div>
      <p> name {nameRef.current}</p>
      <button onClick={changeName}>chang name</button>
    </div>
  )
}

export default UseRefDemo
